.search-container {
    padding: 15px;
    margin-bottom: 16px;
    border-radius: $common-border-radius;
    .search-title {
        color:$common-pink-color;
        font-size: 20px;
        font-weight: bold;
        margin-bottom: 10px;
    }
    .search-main {
        display: flex;
        background-color: $common-white-color;
        border-radius: $common-border-radius;
        .search-input {
            padding: 0 14px;
            height: 30px;
            width: calc(100% - 50px);
            outline: 0;
            border: 2px solid $common-pink-color;
            border-right: none;
            @include border-radius-all(40px, 0, 0, 40px);
        }
        .search-icon {
            height: 30px;
            line-height: 30px;
            width: 50px;
            border: 2px solid $common-pink-color;
            border-left: none;
            @include border-radius-all(0, 40px, 40px, 0);
            cursor: pointer;
            .svg-icon {
                width: 25px;
                height: 25px;
                margin-left: 12px;
            }
            .svg-icon:hover {
                transform: scale(1.1) !important;
            }
        }
    }
}
.search-container:hover {
    box-shadow: $hover-card-shadow;
    .search-icon {
        svg {
            animation: shake-horizontal 0.7s cubic-bezier(0.455, 0.030, 0.515, 0.955) both;
        }
    }
}